import React from 'react';
import { Table, Row, Col, Form, Input, Icon, InputNumber, Radio, DatePicker, Select, Upload, Button, Switch, Modal, Popconfirm, Tabs, message } from 'antd';
const R = require('ramda');
import EditBuyer from '../components/EditBuyer';
const FormItem = Form.Item;
const RadioGroup = Radio.Group;
const Option = Select.Option;

export default Form.create({ wrappedComponentRef: true })(class Buyer extends React.Component {
    constructor(props) {
        super(props);
        let dataSource = R.isNil(this.props.dataSource) ? {} : this.props.dataSource
        this.state = {

        };
    }

    handleResetFields = () => {
        this.props.form.resetFields();
    }

    handleOpenAdd = () => {
        this.editBuyer.handleOpen("add");
    }


    onEdit = (record, type) => {
        this.props.dispatch({ type: 'customerManage/getBuyerById', payload: { id: record.id } });
        this.editBuyer.handleOpen(type);
    };

    columns = [
        { title: '名称', dataIndex: 'name', key: 'name' },
        { title: '国家', dataIndex: 'countryName', key: 'countryName' },
        { title: '地址', dataIndex: 'address', key: 'address' },
        { title: '联系人', dataIndex: 'linkman', key: 'linkman' },
        { title: '电话', dataIndex: 'telephone', key: 'telephone' },
        { title: '创建时间', dataIndex: 'createtime', key: 'createtime' },
        {
            title: '操作', key: 'key_oprator',
            render: (text, record, index) => {
                return (
                    <span>

                        {this.props.disabled == true ?
                            <span>
                                <a href="#" onClick={this.onEdit.bind(this, record, "view")}>查看</a>
                            </span>
                            :
                            <span>
                                <a href="#" disabled={this.props.disabled} onClick={this.onEdit.bind(this, record, "view")}>查看</a>
                                <span className="ant-divider" />
                                <Popconfirm placement="leftTop" title={'数据删除后将不可以恢复，是否继续删除？'}
                                    onConfirm={() => {
                                        this.props.dispatch({
                                            type: 'customerManage/deleteBuyerById',
                                            payload: {
                                                id: record.id,
                                                cstid: record.cstid,
                                            }
                                        })
                                    }} okText="是" cancelText="否">
                                    <a href="#" disabled={this.props.disabled}>删除</a>
                                </Popconfirm>
                            </span>
                        }

                    </span>
                );
            }
        }];

    render() {
        const { getFieldDecorator } = this.props.form;
        let dataSource = R.isNil(this.props.dataSource) ? {} : this.props.dataSource;
        let formItemLayout = {
            labelCol: { xs: { span: 24 }, sm: { span: 6 } },
            wrapperCol: { xs: { span: 24 }, sm: { span: 14 } }
        };
        let values = this.props.form.getFieldsValue();
        let pagination = {
            showTotal: total => `共 ${total} 条数据`,
            pageSize: this.props.buyerPage.size,
            total: this.props.buyerPage.totalRow,
            showSizeChanger: true,
            current: this.props.buyerPage.page,
            onShowSizeChange: (current, size) => {
                let newPage = this.props.buyerPage;
                newPage.size = size;
                newPage.page = 1;
                this.props.dispatch({
                    type: 'customerManage/getBuyerList',
                    payload: {
                        id: R.isNil(dataSource.id) ? "" : dataSource.id,
                        page: newPage,
                        cstId: this.props.cstid
                    }
                });
            },
            onChange: (pageNumber, pageSize) => {
                let newPage = this.props.buyerPage;
                newPage.page = pageNumber;
                this.props.dispatch({
                    type: 'customerManage/getBuyerList',
                    payload: {
                        id: R.isNil(dataSource.id) ? "" : dataSource.id,
                        page: newPage,
                        cstId: this.props.cstid
                    }
                });
            }
        }

        return (
            <div>
                <Form>
                    <Row>
                        <Col span={12}>
                            <FormItem>
                                <Button type="primary" icon="plus" size={'default'} disabled={this.props.disabled} onClick={this.handleOpenAdd.bind(this)} style={{ display: dataSource.chargestatus !== "2" ? 'inline-block' : 'none' }}>增加境外供应商</Button>

                            </FormItem>
                        </Col>
                    </Row>
                </Form>
                <Table dataSource={this.props.buyerList} columns={this.columns} bordered={true} size={'middle'} pagination={pagination} scroll={{ x: true }} />

                <EditBuyer wrappedComponentRef={(inst) => this.editBuyer = inst} dispatch={this.props.dispatch} dataSource={this.props.buyer} cstId={this.props.cstid} />

            </div>
        )
    }
})


// WEBPACK FOOTER //
// ./public/src/components/customer/components/Buyer.js